<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>

<body>
    <button class="set">设置</button>
    <button class="get">获取</button>
</body>
<script>
    // cookie的特性:
    // 1. cookie是以键值对形式存在的字符串(key=val)
    // 2. cookie的存取都依赖于document.cookie
    // 3. cookie可以设置存储路径
    // 4. cookie可以设置过期时间 (默认:浏览器关闭过期)



    // cookie的创建:
    // 1. cookie是以键值对形式存在的字符串(key=val)
    // 2. cookie的存取都依赖于document.cookie
    // 3. cookie存储的时候是一条一条存储的, 取的时候将所有的cookie整合到一整个字符串中 -> 用"; "分隔

    var setBtn = document.getElementsByClassName("set")[0];
    var getBtn = document.getElementsByClassName("get")[0];

    // setBtn.onclick = function () {
    //     document.cookie = "user=a123123";
    //     document.cookie = "pwd=123123";
    //     document.cookie = "phone=17386141517";
    //     document.cookie = "email=123123@163.com";
    // }


    // cookie的时效时 => cookie可以设置过期时间
    // 默认情况下,cookie在浏览会话结束时(浏览器关闭)过期,如果想自定义过期时间,需要给cookie添加expires属性修饰, 每个cookie都可以设置expires属性,接收一个字符串类型的时间(世界时)作为过期时间

    // setBtn.onclick = function () {

    //     var date = new Date();
    //     date.setDate(28 + 7);  //7天后过期

    //     console.log(date.toString());
    //     console.log(date.toUTCString());

    //     // date.toString()     将日期对象转化为字符串(中国标准时间)
    //     // date.toUTCString()  将日期对象转化为字符串(世界时 =>中国标准时间-8 )


    //     document.cookie = "user=a123123; expires=" + date.toUTCString();
    //     document.cookie = "pwd=123123; expires=" + date.toUTCString();
    //     document.cookie = "phone=17386141517; expires=" + date.toUTCString();
    //     document.cookie = "email=123123@163.com; expires=" + date.toUTCString();
    // }


    // cookie的跨页面访问 => cookie可以设置存储路径
    // cookie默认存储在当前文件所在的目录,该目录及其子目录下的文件均可以访问cookie,如果向设置存储路径需要借助path修饰cookie, path可以接收一个自站点根目录起的路径作为cookie的存储位置(/day32/html)

    setBtn.onclick = function () {

        var date = new Date();
        date.setDate(date.getDate() + 7);  //7天后过期

        console.log(date.toString());
        console.log(date.toUTCString());

        // date.toString()     将日期对象转化为字符串(中国标准时间)
        // date.toUTCString()  将日期对象转化为字符串(世界时 =>中国标准时间-8 )


        // document.cookie = "user=a123123; expires=" + date.toUTCString() + "; path=/day32";
        // document.cookie = "pwd=123123; expires=" + date.toUTCString() + "; path=/day32";
        // document.cookie = "phone=17386141517; expires=" + date.toUTCString() + "; path=/day32";
        // document.cookie = "email=123123@163.com; expires=" + date.toUTCString() + "; path=/day32";


        document.cookie = "user=a123123; expires=" + date.toUTCString() + "; path=/";
        document.cookie = "pwd=123123; expires=" + date.toUTCString() + "; path=/";
        document.cookie = "phone=17386141517; expires=" + date.toUTCString() + "; path=/";
        document.cookie = "email=123123@163.com; expires=" + date.toUTCString() + "; path=/";
    }



    getBtn.onclick = function () {
        console.log(document.cookie);
    }



</script>

</html>